import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
const Layout = () => import('../views/layout/layout.vue')
const Home = () => import('../views/home/home.vue')
const SubCategory = () => import('../views/category/sub.vue')
const TopCategory = () => import('../views/category/category.vue')
const Goods = () => import('../views/goods/goods.vue')
const Login = () => import('../views/login/login.vue')
const LoginCallback = () => import('../views/login/callback.vue')
// 页面跳转的路由规则
const routes: Array<RouteRecordRaw> = [
  // 路由重定向
  {
    // 一级路由配置
    path: '/', component: Layout, redirect: '/layout/home', children: [
      // 二级路由配置
      { path: '/', component: Home },
      // 一级分类导航
      { path: '/category/:id', component: TopCategory },
      // 二级分类导航
      { path: '/category/sub/:id', component: SubCategory },
      { path: '/product/:id', component: Goods }
    ]
  },
  //一级路由配置 登录
  { path: '/login', component: Login },
  // qq登录回调
  { path: '/login/callback', component: LoginCallback },
]
const router = createRouter({
  // 创建一个 HTML5 历史，即单页面应用程序中最常见的历史记录。应用程序必须通过 http 协议被提供服务。
  history: createWebHashHistory(),
  routes,
  // 路由更新回到页面顶部
  scrollBehavior(to, from, savedPosition) {
    // 始终滚动到顶部
    return { top: 0, left: 0 }
  }
})

export default router
